<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="shortcut icon" href="<%=basePath %>/static/css/logo.png">
    <link rel="stylesheet" href="<%=basePath %>/static/css/iconfont.css">
    <link rel="stylesheet" href="<%=basePath %>/static/css/global.css">
    <link rel="stylesheet" href="<%=basePath %>/static/css/bootstrap.min.css">
    <link rel="stylesheet" href="<%=basePath %>/static/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="<%=basePath %>/static/css/swiper.min.css">
    <link rel="stylesheet" href="<%=basePath %>/static/css/styles.css">
    <link rel="stylesheet" href="<%=basePath %>/static2/assets/layer/skin/layer.css">

    <script src="<%=basePath %>/static/js/jquery.1.12.4.min.js" charset="UTF-8"></script>
    <script src="<%=basePath %>/static/js/bootstrap.min.js" charset="UTF-8"></script>
    <script src="<%=basePath %>/static/js/swiper.min.js" charset="UTF-8"></script>
    <script src="<%=basePath %>/static/js/global.js" charset="UTF-8"></script>
    <script src="<%=basePath %>/static/js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
    <script src="<%=basePath %>/static2/assets/layer/layer.js" charset="UTF-8"></script>
    <script type="text/javascript">
        //alert("script");
        $(document).ready(function () {
            var userid = '<%=session.getAttribute("userid")%>';

        });

        function onloadobj() {
            //查询到所有的收货地址
            $.ajax({
                type: "POST",
                url: "../receive/selectArea",
                success: function (data) {

                }
            });
        }

        //
        function member_dell(obj, id) {
            //alert("zhixingledianji");
            layer.confirm('确认要删除吗？', function (index) {
                $.ajax({
                    type: "POST",
                    url: "../receive/deleteArea",
                    data: {areaid: id},
                    dataType: "json",
                    success: function (data) {
                    }
                });
                $(obj).parents("tr").remove();
                layer.msg('已删除!', {icon: 1, time: 1000});
            });
        }

        function checknull() {
            if ($("#name").val() == null || $("#suozaidi").val() == null || $("#xiangxi").val() == null || $("#mobile").val() == null)
                return false;
            return true;
        }

        // 添加街道/乡镇
        function townFormat(info) {
            $('.addr-linkage select[name="town"]').hide().empty();
            if (info['code'] % 1e4 && info['code'] < 7e6) {	//是否为“区”且不是港澳台地区
                var ajaxConfig = {
                    url: 'http://passer-by.com/data_location/town/' + info['code'] + '.json',
                    scriptCharset: 'UTF-8',
                    dataType: "json",
                    timeout: 4000,
                    success: function (data) {
                        $('.addr-linkage select[name="town"]').show();
                        // $('#code').val(info['code']) // 填地区编码
                        for (i in data) {
                            $('.addr-linkage select[name="town"]').append(
                                '<option value="' + data[i] + '">' + data[i] + '</option>'
                            );
                        }
                        ;
                        $('.addr-linkage select[name="town"]').find('option[value="洪山镇"]').prop("selected", "selected");
                    },
                };
                $.ajax(ajaxConfig).fail(function (p1, p2, p3) {
                    ajaxConfig.url = 'js/data_location/town/' + info['code'] + '.json';
                    $.ajax(ajaxConfig)
                });
            }
        };
        $('.addr-linkage').citys({
            // 如果某天这个仓库地址失效了dataUrl请使用本地 2017.10 的数据 'js/data_location/list.json'
            dataUrl: 'http://passer-by.com/data_location/list.json',
            spareUrl: 'js/data_location/list.json',
            dataType: 'json',
            valueType: 'name',
            province: '福建省',
            city: '福州市',
            area: '鼓楼区',
            onChange: function (data) {
                townFormat(data)
            },
        }, function (api) {
            var info = api.getInfo();
            townFormat(info);
        });
    </script>
    <title>卓越图书</title>
</head>
<body onload="onloadobj()">
<!-- 顶部tab -->
<div class="tab-header">
    <div class="inner">
        <div class="pull-left">
            <div class="pull-left">嗨，欢迎来到<span class="cr">卓越图书网</span>
                <span id="xianshi">尊敬的${sessionScope.username}</span>
            </div>
        </div>
        <div class="pull-right">
            <a href="<%=basePath %>jsp/udai_welcome.jsp">个人中心</a>
            <a href="<%=basePath %>web/getorders">我的订单</a>
        </div>
    </div>
</div>
<!-- 顶部标题 -->
<div class="bgf5 clearfix">
    <div class="top-user">
        <div class="inner">
            <a class="logo" href="<%=basePath %>jsp/homePage.jsp"><img src="<%=basePath %>/static/css/logo.png"
                                                                       alt="zlBOOK" class="cover"></a>
            <div class="title">个人中心</div>
        </div>
    </div>
</div>
<div class="content clearfix bgf5">
    <section class="user-center inner clearfix">
        <div class="pull-left bgf">
            <a class="title">欢迎使用</a>
            <dl class="user-center__nav">
                <dt>帐户信息</dt>
                <a href="<%=basePath %>jsp/udai_userInfo.jsp">
                    <dd>个人资料</dd>
                </a>
                <a href="<%=basePath %>jsp/udai_address.jsp">
                    <dd>收货地址</dd>
                </a>
                <a href="<%=basePath %>jsp/udai_pwd_modify.jsp">
                    <dd>修改登录密码</dd>
                </a>
            </dl>
            <dl class="user-center__nav">
                <dt>订单中心</dt>
                <a href="<%=basePath %>web/getorders">
                    <dd>我的订单</dd>
                </a>
            </dl>
        </div>
        <div class="pull-right">
            <div class="user-content__box clearfix bgf">
                <div class="title">账户信息-收货地址</div>
                <form action="../receive/addarea" class="user-addr__form form-horizontal" onsubmit="return checknull()"
                      role="form">
                    <p class="fz18 cr">新增收货地址</p>
                    <div class="form-group">
                        <label for="name" class="col-sm-2 control-label">收货人姓名：</label>
                        <div class="col-sm-6">
                            <input class="form-control" name="name" id="name" placeholder="请输入姓名" type="text">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="name" class="col-sm-2 control-label">省/市/区：</label>
                        <div class="col-sm-6">
                            <input class="form-control" name="suozaidi" id="suozaidi" placeholder="请输入所在地" type="text">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="details" class="col-sm-2 control-label">详细地址：</label>
                        <div class="col-sm-10">
                            <input class="form-control" name="xiangxi" id="xiangxi"
                                   placeholder="建议您如实填写详细收货地址，例如街道名称，门牌号码等信息" maxlength="30" type="text">
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="mobile" class="col-sm-2 control-label">手机号码：</label>
                        <div class="col-sm-6">
                            <input class="form-control" name="mobile" id="mobile" placeholder="请输入手机号码" type="text">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-6">
                            <button type="submit" class="but">保存</button>
                        </div>
                    </div>
                </form>
                <p class="fz18 cr">已保存的有效地址</p>

                <div role="tabpanel" class="tab-pane fade in active" id="all">
                    <table class="table text-center">
                        <tr>
                            <th width="85">收件人</th>
                            <th width="150">所在地</th>
                            <th width="180">详细地址</th>
                            <th width="120">电话/手机</th>
                            <th width="120">操作</th>
                        </tr>
                        <c:forEach items="${areaList}" var="area">
                            <tr class="order-item" id="">
                                <td>${area.shoujianren}</td>
                                <td>${area.suozaidi }</td>
                                <td>${area.xiangxi }</td>
                                <td>${area.shoujianphone }<br></td>
                                <td class="order">
                                    <a href="udai_address_edit.jsp?shoujianren=${area.shoujianren}&suozaidi=${area.suozaidi }&xiangxi=${area.xiangxi }&shoujianphone=${area.shoujianphone }&areaid=${area.areaID }"
                                       class="but but-primary">修改</a>
                                    <!-- <a href="" class="but but-link">评价</a> -->
                                    <a onclick="member_dell(this,'${area.areaID}')" class="but but-primary">删除</a>
                                </td>
                            </tr>
                        </c:forEach>

                    </table>
                </div>

            </div>
        </div>
    </section>
</div>
<!-- 右侧菜单 -->
<div class="right-nav">
    <ul class="r-with-gotop">
        <li class="r-toolbar-item">
            <a href="udai_welcome.jsp" class="r-item-hd">
                <i class="iconfont icon-user" data-badge="0"></i>
                <div class="r-tip__box"><span class="r-tip-text">用户中心</span></div>
            </a>
        </li>
        <li class="r-toolbar-item">
            <a href="udai_shopcart.jsp" class="r-item-hd">
                <i class="iconfont icon-cart"></i>
                <div class="r-tip__box"><span class="r-tip-text">购物车</span></div>
            </a>
        </li>
        <li class="r-toolbar-item">
            <a href="" class="r-item-hd">
                <i class="iconfont icon-aixin"></i>
                <div class="r-tip__box"><span class="r-tip-text">我的收藏</span></div>
            </a>
        </li>
        <li class="r-toolbar-item">
            <a href="" class="r-item-hd">
                <i class="iconfont icon-liaotian"></i>
                <div class="r-tip__box"><span class="r-tip-text">联系客服</span></div>
            </a>
        </li>
        <li class="r-toolbar-item">
            <a href="" class="r-item-hd">
                <i class="iconfont icon-liuyan"></i>
                <div class="r-tip__box"><span class="r-tip-text">留言反馈</span></div>
            </a>
        </li>
        <li class="r-toolbar-item to-top">
            <i class="iconfont icon-top"></i>
            <div class="r-tip__box"><span class="r-tip-text">返回顶部</span></div>
        </li>
    </ul>
    <script>
        $(document).ready(function () {
            $('.to-top').toTop({position: false})
        });
    </script>
</div>
<!-- 底部信息 -->
<div class="footer">
    <div class="footer-tags">
        <div class="tags-box inner">
            <div class="tag-div">
                <img src="<%=basePath %>/static/images/icons/footer_1.gif" alt="厂家直供">
            </div>
            <div class="tag-div">
                <img src="<%=basePath %>/static/images/icons/footer_2.gif" alt="一件代发">
            </div>
            <div class="tag-div">
                <img src="<%=basePath %>/static/images/icons/footer_3.gif" alt="美工活动支持">
            </div>
            <div class="tag-div">
                <img src="<%=basePath %>/static/images/icons/footer_4.gif" alt="信誉认证">
            </div>
        </div>
    </div>
    <div class="copy-box clearfix">
        <!-- 版权 -->
        <p class="copyright">
            ©卓越图书网 版权所有，并保留所有权利<br>
            河南省郑州市中原区科学大道100号
        </p>
    </div>
</div>
</body>
</html>